(function($) {
    var o = {
        message: 'Deposer votre fichier ici',
        script: 'http://localhost/Capt_art/admin/photos/upload',
        clone: true
    }
    $.fn.dropfile = function(oo) {
        var replace = false;
        if (oo)
            $.extend(o, oo);
        this.each(function() {
            $('<span>').addClass('instructions').append(o.message).appendTo(this);
            $('<span>').addClass('progress').appendTo(this);
            $(this).bind({
                dragenter: function(e) {
                    e.preventDefault();
                },
                dragover: function(e) {
                    e.preventDefault();
                    $(this).addClass('hover');
                },
                dragleave: function(e) {
                    e.preventDefault();
                    $(this).removeClass('hover');
                }
            });

            this.addEventListener('drop', function(e) {
                e.preventDefault();
                var files = e.dataTransfer.files;
                if ($(this).data('value')) {
                    replace = true;
                }
                upload(files, $(this), 0);
            }, false);
        });

        function upload(files, area, index) {
            var file = files[index];
            var name = file.name.toString();
            if (name.indexOf('.png') >= 0 || name.indexOf('.jpg') >= 0 || name.indexOf('.jpeg') >= 0) {
                if (index > 0 && o.clone) {
                    area = area.clone().html('').insertAfter(area).dropfile(o);
                    area.data('value',null);
                }
                var xhr = new XMLHttpRequest();
                var progress = area.find('progress');
                //Evenements

                xhr.addEventListener('load', function(e) {
                    var json = jQuery.parseJSON(e.target.responseText);
                    area.removeClass('hover');
                    progress.css({height: 0});
                    if (index < files.length - 1)
                    {
                        upload(files, area, index + 1);
                    }
                    if (o.clone && !replace && index == files.length - 1)
                    {
                        area.clone().html('').insertAfter(area).dropfile(o);
                        area.data('value', null);
                    }
                    area.append(json.content);

                }, false);

                xhr.upload.addEventListener('progress', function(e) {
                    if (e.lengthComputable) {
                        var perc = (Math.round(e.loaded / e.total) * 100) + ' %';
                        progress.css({height: perc}).html(perc);
                    }
                }, false);

                xhr.open('post', o.script, true);
                xhr.setRequestHeader('content-type', 'multipart/form-data');
                xhr.setRequestHeader('file-type', file.type);
                xhr.setRequestHeader('file-size', file.size);
                xhr.setRequestHeader('file-name', file.name);
                for (var i  in area.data()) {
                    if (typeof area.data(i) !== 'object') {
                        xhr.setRequestHeader('param-' + i, area.data(i));
                    }
                }
                xhr.send(file);
            } else {
                $(area).empty();
                $(area).removeClass('hover');
                $('<span>').addClass('error').append('Fichier invalide <br/> jpg, jpeg ou png seulement').appendTo(area);
            }
        }
        return this;
    };
})(jQuery);

